<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>肠癌诊断记录抽取平台</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <script type="text/javascript" src="./libs/jquery-3.4.0.min.js"></script>
    <link rel="stylesheet" href="./libs/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="index.css" media="all">
</head>
<body>
<div class="container">
    <div class="menu" id="id1">
        <div class="menu_title" style="color: white;">
            <text>肠癌诊断知识管理系统</text>
        </div>
        <div class="choosed" id="text_extraction" onclick="changePage(this.id)">
            <div class="front_block"></div>
            <text style="cursor: pointer;">抽取记录</text>
        </div>
        <div class="unChoosed" id="add_record" onclick="changePage(this.id)">
            <div class="front_block"></div>
            <text>添加记录</text>
        </div>
        <div class="unChoosed" id="export" onclick="changePage(this.id)">
            <div class="front_block"></div>
            <text>导出</text>
        </div>
        <div class="unChoosed" id="show" onclick="changePage(this.id); show()">
            <div class="front_block"></div>
            <text>展示</text>
        </div>
    </div>
    <div class="content">
        <div class="title">
            <img src="../image/wenhao.png" alt="" style="width: 20px; height: 20px;">
            <text>帮助</text>
            <img src="../image/user.png" alt="" style="width: 20px; height: 20px;">
            <text>管理员</text>
        </div>
        <div class="detail">
            <div class="text_extraction_wrap" id="text_extraction_wrap">
                <div class="search">
                    <input type="text" name="search" placeholder="请输入"/>
                    <select id="which_way">
                        <option value="id">id</option>
                        <option value="keyword">关键字</option>
                    </select>
                    <div id="search" onclick="search()">搜索</div>
                </div>



            <div id="search_number_wrap" style="display: flex; align-items: center; height: 40px; ">
                <div style="visibility: hidden; display: flex; text-align: center" id="tip">根据关键字
                    <div id="keyword" style="color: #5ab0f0;"></div>
                    搜索到
                    <div id="search_total" style="color: #5ab0f0; padding-top:2px;"></div>
                    条记录
                </div>
            </div>

            <ul class="layui-nav" style="padding-left: 0;">
                <li class="layui-nav-item" style="margin-right: 20px;">
                    <a href="javascript:;" id="to_add_record" onclick="to_add_record()">添加记录</a>
                </li>

                <li class="layui-nav-item">
                    <!--                        <a href="javascript:;" id="nav_title">批量操作</a>-->
                    <!--                        <dl class="layui-nav-child">-->
                    <!--                            <dd><a href="" name="view_more">查看</a></dd>-->
                    <!--                            <dd><a href="" name="edit_more">编辑</a></dd>-->
                    <!--                            <dd><a href="" name="expt_more">导出</a></dd>-->
                    <!--                            <dd><a href="" name="delt_more">删除</a></dd>-->
                    <!--                            &lt;!&ndash;                            class="layui-this"&ndash;&gt;-->
                    <!--                        </dl>-->
                    <a href="javascript:;" id="to_export_record" onclick="to_export_record()"
                       style="border: 0.5px solid #B2B2B2;">导出记录</a>
                </li>
            </ul>

            <div id="selected_record_number_wrap" style="display: flex; align-items: center; height: 40px; ">
<!--                已选择-->
<!--                <div id="selected_record_number">0</div>-->
<!--                项-->
            </div>

            <div class="record_list">
                <form class="layui-form" action="">
                    <div class="layui-form-item" pane="">
                        <div class="layui-input-block">
                            <div class="record_title_wrap" style="display: flex; height: 50px; padding-top: 20px;">
<!--                                <input type="checkbox" lay-filter="all" name="checkbox_all" lay-skin="primary"-->
<!--                                       title="">-->
                                <div style="padding-top: 10px; padding-left: 7px;">ID</div>
                                <div class="record_title" style="display: flex; height: 28px; width: 100%;">
                                    <div style="width: 60%; padding-left: 100px;">抽取记录</div>
                                    <div style="width: 20%; text-align: center;">修改时间</div>
                                    <div style="width: 20%; text-align: center">操作</div>
                                </div>
                                <!--                                    </div>-->
                            </div>
                            <div class="record" id="record">
<!--                                <div class="record_1">-->
<!--                                    <input type="checkbox" lay-filter="checkbox" id="checkbox_1" name="checkbox"-->
<!--                                           lay-skin="primary" title="">-->
<!--                                    <div class="record_detail">-->
<!--                                        <div class="id_title" list_number="1" id="record_id_1">-->
<!--                                        </div>-->
<!--                                        <div class="changeTime">-->
<!--                                            <div id="time_1"></div>-->
<!--                                        </div>-->
<!--                                        <div class="operate">-->
<!--                                            <div number="1" list_number="1" name="view">查看</div>-->
<!--                                            <div number="1" list_number="1" name="edit">编辑</div>-->
<!--                                            &lt;!&ndash;<div number="1" name="expt">导出</div>&ndash;&gt;-->
<!--                                            <div number="1" list_number="1" name="delt">删除</div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="record_2">-->
<!--                                    <input type="checkbox" lay-filter="checkbox" id="checkbox_2" name="checkbox"-->
<!--                                           lay-skin="primary" title="">-->
<!--                                    <div class="record_detail">-->
<!--                                        <div class="id_title" list_number="2" id="record_id_2">-->
<!--                                        </div>-->
<!--                                        <div class="changeTime">-->
<!--                                            <div id="time_2"></div>-->
<!--                                        </div>-->
<!--                                        <div class="operate">-->
<!--                                            <div number="2" list_number="2" name="view">查看</div>-->
<!--                                            <div number="2" list_number="2" name="edit">编辑</div>-->
<!--                                            &lt;!&ndash;<div number="2" name="expt">导出</div>&ndash;&gt;-->
<!--                                            <div number="2" list_number="2" name="delt">删除</div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="record_3">-->
<!--                                    <input type="checkbox" lay-filter="checkbox" id="checkbox_3" name="checkbox"-->
<!--                                           lay-skin="primary" title="">-->
<!--                                    <div class="record_detail">-->
<!--                                        <div class="id_title" list_number="3" id="record_id_3">-->
<!--                                        </div>-->
<!--                                        <div class="changeTime">-->
<!--                                            <div id="time_3"></div>-->
<!--                                        </div>-->
<!--                                        <div class="operate">-->
<!--                                            <div number="3" list_number="3" name="view">查看</div>-->
<!--                                            <div number="3" list_number="3" name="edit">编辑</div>-->
<!--                                            &lt;!&ndash;<div number="3" name="expt">导出</div>&ndash;&gt;-->
<!--                                            <div number="3" list_number="3" name="delt">删除</div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="record_4">-->
<!--                                    <input type="checkbox" lay-filter="checkbox" id="checkbox_4" name="checkbox"-->
<!--                                           lay-skin="primary" title="">-->
<!--                                    <div class="record_detail">-->
<!--                                        <div class="id_title" list_number="4" id="record_id_4">-->
<!--                                        </div>-->
<!--                                        <div class="changeTime">-->
<!--                                            <div id="time_4"></div>-->
<!--                                        </div>-->
<!--                                        <div class="operate">-->
<!--                                            <div number="4" list_number="4" name="view">查看</div>-->
<!--                                            <div number="4" list_number="4" name="edit">编辑</div>-->
<!--                                            &lt;!&ndash;<div number="4" name="expt">导出</div>&ndash;&gt;-->
<!--                                            <div number="4" list_number="4" name="delt">删除</div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="record_5">-->
<!--                                    <input type="checkbox" lay-filter="checkbox" id="checkbox_5" name="checkbox"-->
<!--                                           lay-skin="primary" value="5" title="">-->
<!--                                    <div class="record_detail">-->
<!--                                        <div class="id_title" list_number="5" id="record_id_5">-->
<!--                                        </div>-->
<!--                                        <div class="changeTime">-->
<!--                                            <div id="time_5"></div>-->
<!--                                        </div>-->
<!--                                        <div class="operate">-->
<!--                                            <div number="5" list_number="5" name="view">查看</div>-->
<!--                                            <div number="5" list_number="5" name="edit">编辑</div>-->
<!--                                            &lt;!&ndash;<div number="5" name="expt">导出</div>&ndash;&gt;-->
<!--                                            <div number="5" list_number="5" name="delt">删除</div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div style="display: flex; align-items:center; justify-content: center;">
                <div id="demo2"></div>
            </div>

        </div>
        <div class="view_wrap" id="view_wrap">
            <div class="return_wrap">
                <div class="return_icon" onclick="return_home(1)">
                    <i class="layui-icon layui-icon-return" style="font-size: 20px; color: #7f7f7f;"></i>
                    返回
                </div>
            </div>
            <table class="layui-hide" id="view_table" style="width:200px;"></table>
        </div>
        <div class="edit_wrap" id="edit_wrap">
            <div class="return_wrap">
                <div class="return_icon" onclick="return_home(1)">
                    <i class="layui-icon layui-icon-return" style="font-size: 20px; color: #7f7f7f;"></i>
                    返回
                </div>
            </div>
            <table class="layui-table" id="edit_table" lay-data="{url:'', id:'edit_table'}" lay-filter="edit_table">
                <thead>
                <tr>
                    <th lay-data="{field:'ID'}">编号</th>
                    <th lay-data="{field:'attr', edit:'text'}">属性</th>
                    <th lay-data="{field:'result', edit: 'text'}">诊断结果</th>
                </tr>
                </thead>
            </table>
            <div style="display: flex;justify-content: center">
                <button class="layui-btn layui-btn-normal layui-btn-radius" style="width: 80px;"
                        onclick="update_data()">保存
                </button>
            </div>
        </div>
        <div class="add_record_wrap" id="add_record_wrap"
             style="height: 200px; padding-top: 200px; padding-bottom:200px;">
            <div class="layui-form-item"
                 style="display: flex; align-items: center; justify-content: center; flex-direction: column; margin-bottom: 50px;">
                <div class="layui-form-label" style="font-size: 20px;">添加记录</div>
                <form class="layui-form" action="">

                    <div class="layui-input-block" style="display: flex; width: 400px;">
                        <form class="layui-form">
                            <div style="width: 100px; text-align: center; line-height: 38px;">方式一：</div>
                            <input type="text" name="title" lay-verify="title" autocomplete="off"
                                   placeholder="请输入记录名称"
                                   class="layui-input">
                            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="add_text">确认上传
                            </button>
                        </form>
                    </div>
                </form>
            </div>

            <div class="layui-upload" style="display: flex; flex-direction: row; width: 270px;">
                <div>方式二：</div>
                <button type="button" class="layui-btn layui-btn-normal" id="upload" style="margin-right: 20px;">
                    选择文件
                </button>
                <button type="button" class="layui-btn" id="add_file">开始上传</button>
            </div>
            <div style="color: #a5a5a5;">支持.csv .xlsx文件</div>
        </div>
        <div class="export_wrap" id="export_wrap">
            <a href="http://api.kernelylz.cn/export">导出记录</a>
        </div>
        <div class="show_wrap" id="show_wrap">
            <div class="card_wrap">

            </div>
            <!--                <div class="card_1">-->
            <!--                    <div class="card_title">-->
            <!--                        记录-->
            <!--                    </div>-->
            <!--                    <div class="card_content">-->

            <!--                    </div>-->
            <!--                </div>-->
            <div style="display: flex; align-items:center; justify-content: center; bottom: 0;">
                <div id="btn"></div>
            </div>

        </div>
    </div>

</div>
</div>
<!--<script src="test.js" charset="utf-8"></script>-->
<script src="index.js" charset="utf-8"></script>
<script src="libs/layui/layui.js" charset="utf-8"></script>

</body>
</html>